﻿<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">

<head>
    <jsp:include page="/common.jsp"></jsp:include>
</head>

<body class="navbar-top">
<div class="modal-shiftfix">
    <jsp:include page="/menu.jsp"></jsp:include>
    <div class="container-fluid main-content">
        <div class="row">
            <div class="col-sm-2">
                <div class="list-group">
                    <a class="list-group-item " href="mail/index.html">
                        <p>收件箱</p>
                    </a>
                    <a class="list-group-item " href="mail/starred.html">
                        <p>
                            星标邮件
                        </p>
                    </a>
                    <a class="list-group-item " href="mail/important.html">
                        <p>
                            重要邮件
                        </p>
                    </a>
                    <a class="list-group-item " href="mail/sent.html">
                        <p>发件箱</p>
                    </a>
                </div>
            </div>
            <div class="col-sm-10">
                <div class="widget-container fluid-height clearfix">
                    <div class="widget-content padded clearfix">
                        <form method="post" action="${pageContext.request.contextPath}/MailServlet?method=add" id="writeForm">
                            <input type="hidden" name="receiver.employeeId" id="addressee_id" value=""/>
                            <input type="hidden" name="_csrf"
                                   value="WERrNjB6dXk6Mz1dCQM2AQkqW2Z9QhoyBy4aU1wqHCEvECV.QjwPTg=="/>

                            <div class="form-group clearfix">
                                <button type="submit" class="btn btn-sm btn-success"><i
                                        class="fa fa-share-square-o"></i> 发送邮件
                                </button>
                                <button type="reset" class="btn btn-sm btn-default">重置</button>
                            </div>
                            <div class="form-group">
                                <div class="input-group">
                                    <input id="addressee"  readonly class="form-control"
                                           placeholder="选择收件人...." type="text">
                                    <span class="input-group-btn"><button class="btn btn-default weiBoxs-dialog"
                                                                          type="button" dialog-title="选择收件人"
                                                                          dialog-url="/mail/sel-manage.html"
                                                                          dialog-callback="selectManages"
                                     onclick="openMyModal()" >点击选择
                                    </button></span>
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="input-group">
                                    <span class="input-group-addon">主&nbsp;&nbsp;&nbsp;&nbsp;题</span>
                                    <input type="text" name="theme" class="form-control" placeholder="邮件主题....">
                                </div>
                            </div>
                            <div class="form-group">
                                <h5 style="margin-top: 30px">邮件内容</h5>
                                <textarea class="form-control" name="content"></textarea>
                            </div>
                            <div class="form-group clearfix">
                                <span class="pull-left"></span>
                                <span class="pull-right">发件人：小明</span>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
     aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"
                        aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel">选择收件人</h4>
            </div>
            <div class="modal-body ">
                <table id="example" class="table exampleTable">
                    <thead>
                    <tr>
                        <th>选择</th>
                        <th>姓名</th>
                        <th>部门</th>
                        <th>职位</th>
                    </tr>
                    </thead>
                    <tbody>
                        <c:forEach items="${employeeList}" var="receiver">
                            <tr>
                                <td><input type="radio" name="receiver"
                                           style="opacity: 1;" value="${receiver.employeeId}" /></td>
                                <td>${receiver.employeeName}</td>
                                <td>${receiver.departmentId}</td>
                                <td>${receiver.positionId}</td>
                            </tr>
                        </c:forEach>
                    </tbody>
                </table>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭
                </button>
                <button type="button" class="btn btn-primary" id="confirm01">提交更改</button>
            </div>
        </div>
    </div>
</div>

</body>

<script>
    function openMyModal() {
        $("#myModal").modal("show");
        $("#confirm01").click(
            function() {
                var id = $("input[name='receiver']:checked").val();
                var customerName = $("input[name='receiver']:checked")
                    .parent().next().text();
                $("#addressee_id").val(id);
                $("#addressee").val(customerName);
                $("#myModal").modal("hide");
            });
    }
</script>

</html>
